<div *ngIf="pageService">
  <nz-dropdown-menu #rightClickMenu="nzDropdownMenu" (show)="pageService.closeMenu() " style="width:200px;">
    <ul nz-menu style="width:200px;">
      <span *ngIf="pageStatus.checkedFiles.length>0">
        <li nz-menu-item *ngIf="pageStatus.checkedFiles.length==1" (click)="openFileClick()">打开文件位置</li>
        <li nz-menu-item (click)="pageService.downloadClick()">下载</li>
        <li nz-menu-item (click)="pageService.deleteFileClick()">删除</li>
        <li nz-menu-item (click)="pageService.renameFileClick()" *ngIf="pageStatus.checkedFiles.length==1">重命名</li>
        <li nz-menu-item (click)="pageService.copyFileClick()">复制</li>
        <li nz-menu-item (click)="pageService.cutFileClick()">剪贴</li>
      <hr style="margin: 0;padding: 0;border:none;border-bottom: 1px solid rgba(0,0,0,.1)">
      </span>
      <li nz-submenu nzTitle="新建">
        <ul>
          <li nz-menu-item (click)="pageService.mkDirClick()">文件夹</li>
          <li nz-menu-item onclick="document.form.fileInput.click()">上传</li>
          <li nz-menu-item>离线任务</li>
        </ul>
      </li>
      <li nz-menu-item onclick="location.reload();">刷新</li>
      <li nz-menu-item (click)="pageService.ediePermissionClick()">共享设置</li>
    </ul>
  </nz-dropdown-menu>
  <form name="form" method="post" action="javascript:;">
    <input type="file" name="fileInput" id="fileInput" style="display: none;" multiple
           (change)="pageService.onUploadFileSelected($event)">
  </form>
  <nz-dropdown-menu #addMenu="nzDropdownMenu">
    <ul nz-menu>
      <li nz-menu-item (click)="pageService.mkDirClick()">
        <button nz-button nzType="primary" nzSize="small" nzGhost><i nz-icon nzType="folder-add"></i>文件夹</button>
      </li>
      <li nz-menu-item onclick="document.form.fileInput.click()">
        <button nz-button nzType="primary" nzSize="small" nzGhost><i nz-icon nzType="upload"></i>上传文件</button>
      </li>
      <li nz-menu-item>
        <button nz-button nzType="primary" nzSize="small" nzGhost><i nz-icon nzType="cloud-server"></i>离线下载</button>
      </li>
    </ul>
  </nz-dropdown-menu>
  <div class="site-page-header-ghost-wrapper white-back" style="height: 55px">
    <nz-page-header-title class="white-back">
      <div style="text-align: center">
        <nz-radio-group [(ngModel)]="pageService.category" nzButtonStyle="solid" (ngModelChange)="categoryChange()">
          <label nz-radio-button nzValue="image">图片</label>
          <label nz-radio-button nzValue="text">文档</label>
          <label nz-radio-button nzValue="video">视频</label>
          <label nz-radio-button nzValue="audio">音频</label>
          <label nz-radio-button nzValue="zip">压缩包</label>
        </nz-radio-group>
      </div>

    </nz-page-header-title>
    <!--    <nz-page-header-subtitle>This is a subtitle</nz-page-header-subtitle>-->
  </div>
  <nz-layout class="layout"
             (contextmenu)="pageService.diskPageContextmenuClick($event, rightClickMenu);$event.stopPropagation();">
    <nz-header class="white-back" style="padding: 0px">
      <div class="white-back">
        <button nz-button nzType="primary" nz-dropdown nzTrigger="click" [nzDropdownMenu]="addMenu" style="margin-right: 10px"
                nzSize="default" nzShape="round"><i nz-icon nzType="appstore-add" nzTheme="outline"></i>新建
        </button>
        <span class="op-com-bt-box" *ngIf="pageStatus.checkedFiles.length>0">
            <button (click)="pageService.downloadClick()" nz-button nzType="primary" nzSize="default" nzShape="round"
                    nzGhost>下载</button>
            <button (click)="pageService.ediePermissionClick()" nz-button nzType="primary" nzSize="default" nzShape="round"
                    nzGhost>共享</button>
            <button (click)="pageService.copyFileClick()" nz-button nzType="primary" nzSize="default" nzShape="round"
                    nzGhost>复制</button>
            <button (click)="pageService.cutFileClick()" nz-button nzType="primary" nzSize="default" nzShape="round"
                    nzGhost>剪贴</button>
            <button (click)="pageService.deleteFileClick()" nz-button nzType="primary" nzSize="default" nzShape="round"
                    nzGhost>删除</button>
          </span>
      </div>
    </nz-header>

    <nz-content class="white-back">
      <nz-layout class="white-back">
        <nz-content class="white-back" style="margin-right: 10px">
          <nz-spin nzTip="加载中..." [nzSpinning]="pageStatus.loading" style="height: 100%">
            <nz-empty *ngIf="pageStatus.fileList.length==0" style="margin-top: 10%"
                      nzNotFoundImage="simple" nzNotFoundContent="文件夹空空如也" >
            </nz-empty>
            <nz-table *ngIf="pageStatus.fileList.length>0" #editRowTable [nzData]="pageStatus.fileList" style="height: 100%"
                      [nzScroll]="{ y: '100%' }" nzShowPagination="false" nzBordered="false">
              <thead>
              <tr>
                <th nzWidth="25px" [(nzChecked)]="pageStatus.all_checked" (nzCheckedChange)="pageService.onAllChecked($event)"></th>
                <th >名称</th>
                <th nzWidth="200px">大小</th>
                <th nzWidth="200px">修改日期</th>
                <th>共享状态</th>
              </tr>
              </thead>
              <tbody>
              <tr *ngFor="let file of editRowTable.data;"
                  (contextmenu)="pageService.contextMenu($event, rightClickMenu,file);$event.stopPropagation();"
                  (click)="pageService.onAllChecked(false);pageService.onItemChecked(file,!file.checked);"
                  (dblclick)="pageService.fileDoubleClick(file)">
                <td [nzChecked]="file.checked==true" (nzCheckedChange)="pageService.onItemChecked(file, $event);"
                    (click)="$event.stopPropagation();"></td>
                <td><img style="width: 20px" [src]="pageService.getImgURL(file)" alt="未知类型"> {{file['name']}}</td>
                <!--          <td>{{ file.type }}</td>-->
                <td>{{ (file.size | nzBytes) || '-' }}</td>
                <td>{{ file.lastModified | date:'yyyy-MM-dd HH:mm:ss'}}</td>
                <td>
                  <nz-tag *ngIf="file.permission?.ann?.open" nzColor="orange">ann</nz-tag>
                  <nz-tag *ngIf="file.permission?.user?.open" nzColor="green">user</nz-tag>
                  <nz-tag *ngIf="file.permission?.custom?.open" nzColor="blue">custom</nz-tag>
                </td>
              </tr>
              </tbody>
            </nz-table>
          </nz-spin>
        </nz-content>
        <nz-sider nzTheme="light" nzWidth="260px" style=" margin-right: 10px">
          <bby-file-info [checkedFiles]="pageStatus.checkedFiles" [rootUrl]="pageService.rootUrl"
                         [path]="pageStatus.open_path"></bby-file-info>
        </nz-sider>
      </nz-layout>
    </nz-content>
  </nz-layout>
</div>
